<template>
    <view style="height: 100%">
        <!-- pages/setuuid/setuuid.wxml -->
        <!-- pages/setuuid/setuuid.wxml -->
        <radio-group class="radio-group" @change="radioChange">
            <label class="radio" v-for="(item, index) in items" :key="index">
                <radio :value="item.name" :checked="item.checked" />

                {{ item.value }}
            </label>
        </radio-group>

        <view class="page-section">
            <view class="weui-cells__title" style="font-size: 14px; color: #555; margin-left: 10px; margin-top: 10px">ServiceUUID</view>
            <view class="weui-cells weui-cells_after-title">
                <view class="weui-cell weui-cell_input">
                    <input
                        class="inputView"
                        maxlength="37"
                        :adjust-position="true"
                        @blur="inputend1"
                        style="font-size: 16px; margin-left: 10px"
                        @input="bindReplaceInput"
                        placeholder="uuid"
                        :value="serviceuuid"
                        :disabled="inputen"
                    />
                </view>
            </view>
        </view>

        <view class="page-section">
            <view class="weui-cells__title" style="font-size: 14px; color: #555; margin-left: 10px; margin-top: 10px">Notify UUID</view>
            <view class="weui-cells weui-cells_after-title">
                <view class="weui-cell weui-cell_input">
                    <input
                        class="inputView"
                        maxlength="37"
                        :adjust-position="true"
                        @blur="inputend2"
                        style="font-size: 16px; margin-left: 10px"
                        @input="bindReplaceInput"
                        placeholder="uuid"
                        :value="rxduuid"
                        :disabled="inputen"
                    />
                </view>
            </view>
        </view>

        <view class="page-section">
            <view class="weui-cells__title" style="font-size: 14px; color: #555; margin-left: 10px; margin-top: 10px">Write UUID</view>
            <view class="weui-cells weui-cells_after-title">
                <view class="weui-cell weui-cell_input">
                    <input
                        class="inputView"
                        maxlength="37"
                        :adjust-position="true"
                        @blur="inputend3"
                        style="font-size: 16px; margin-left: 10px"
                        @input="bindReplaceInput"
                        placeholder="uuid"
                        :value="txduuid"
                        :disabled="inputen"
                    />
                </view>
            </view>
        </view>
        <text style="font-size: 16px; color: #f22; margin-left: 10px; margin-top: 10px">{{ mtext }}</text>

        <button style="margin-top: 20px" @tap="backok" class="button_sp" hover-class="button_sp2">确认</button>
    </view>
</template>

<script>
// pages/setuuid/setuuid.js
var app = getApp();
var util = require('../../utils/util.js');
export default {
    data() {
        return {
            items: [
                {
                    name: '0',
                    value: '常规模组',
                    checked: 'true'
                },
                {
                    name: '1',
                    value: 'BT16模组'
                },
                {
                    name: '2',
                    value: '指定UUID'
                }
            ],
            serviceuuid: '',
            txduuid: '',
            rxduuid: '',
            inputen: false,
            nowsel: 0,
            mtext: ''
        };
    }
    /**
     * 生命周期函数--监听页面加载
     */,
    onLoad: function (options) {
        app.globalData.readUUID();
        this.nowsel = app.globalData.muuidSel;
        switch (this.nowsel) {
            case 0:
                this.setData({
                    serviceuuid: '0000FFE0-0000-1000-8000-00805F9B34FB',
                    txduuid: '0000FFE1-0000-1000-8000-00805F9B34FB',
                    rxduuid: '0000FFE1-0000-1000-8000-00805F9B34FB',
                    inputen: true,
                    'items[0].checked': true,
                    'items[1].checked': false,
                    'items[2].checked': false
                });
                break;
            case 1:
                this.setData({
                    serviceuuid: '0000FFE0-0000-1000-8000-00805F9B34FB',
                    txduuid: '0000FFE2-0000-1000-8000-00805F9B34FB',
                    rxduuid: '0000FFE1-0000-1000-8000-00805F9B34FB',
                    inputen: true,
                    'items[0].checked': false,
                    'items[1].checked': true,
                    'items[2].checked': false
                });
                break;
            case 2:
                this.setData({
                    serviceuuid: app.globalData.usrserviceuuid,
                    txduuid: app.globalData.usrtxduuid,
                    rxduuid: app.globalData.usrrxduuid,
                    inputen: false,
                    'items[0].checked': false,
                    'items[1].checked': false,
                    'items[2].checked': true
                });
                break;
        }
        console.log(this.serviceuuid);
    },
    methods: {
        radioChange(e) {
            console.log('radio发生change事件，携带value值为：', e.detail.value);
            let index = e.currentTarget.dataset.id;
            switch (e.detail.value) {
                case '0':
                    this.setData({
                        serviceuuid: '0000FFE0-0000-1000-8000-00805F9B34FB',
                        txduuid: '0000FFE1-0000-1000-8000-00805F9B34FB',
                        rxduuid: '0000FFE1-0000-1000-8000-00805F9B34FB',
                        inputen: true
                    });
                    this.nowsel = 0;
                    app.globalData.muuidSel = 0;
                    break;
                case '1':
                    this.setData({
                        serviceuuid: '0000FFE0-0000-1000-8000-00805F9B34FB',
                        txduuid: '0000FFE2-0000-1000-8000-00805F9B34FB',
                        rxduuid: '0000FFE1-0000-1000-8000-00805F9B34FB',
                        inputen: true
                    });
                    this.nowsel = 1;
                    app.globalData.muuidSel = 1;
                    break;
                case '2':
                    this.setData({
                        serviceuuid: app.globalData.usrserviceuuid,
                        txduuid: app.globalData.usrtxduuid,
                        rxduuid: app.globalData.usrrxduuid,
                        inputen: false
                    });
                    this.nowsel = 2;
                    app.globalData.muuidSel = 2;
                    break;
            }
            console.log(this.serviceuuid);
            console.log(app.globalData.usrrxduuid);
            console.log('radio发生change事件，index ：', this.nowsel);
        },

        backok() {
            console.log(this.serviceuuid);
            if (!util.isUUID(this.serviceuuid)) {
                this.setData({
                    mtext: '错误的ServiceUUID 格式'
                });
                return;
            }
            if (!util.isUUID(this.txduuid)) {
                this.setData({
                    mtext: '错误的Notify UUID 格式'
                });
                return;
            }
            if (!util.isUUID(this.rxduuid)) {
                this.setData({
                    mtext: '错误的Write UUID 格式'
                });
                return;
            }
            app.globalData.mserviceuuid = this.serviceuuid;
            app.globalData.mtxduuid = this.txduuid;
            app.globalData.mrxduuid = this.rxduuid;
            if (this.nowsel == 2) {
                //保存用户的设置
                app.globalData.saveusrUUID(this.serviceuuid, this.txduuid, this.rxduuid);
            }
            app.globalData.savelastsel(this.nowsel);
            //wx.navigateTo({
            //  url: '/pages/index/index',
            //})
            uni.navigateBack({
                delta: 1
            });
        },

        bindReplaceInput: function (e) {
            var value = e.detail.value;
            var pos = e.detail.cursor;
            var tet = util.strToUUID(value);
            // 直接返回对象，可以对输入进行过滤处理，同时可以控制光标的位置
            return {
                value: tet
            };
        },

        inputend1: function (e) {
            this.setData({
                serviceuuid: e.detail.value
            });
        },

        inputend2: function (e) {
            this.setData({
                rxduuid: e.detail.value
            });
        },

        inputend3: function (e) {
            this.setData({
                txduuid: e.detail.value
            });
        }
    }
};
</script>
<style>
/* pages/setuuid/setuuid.wxss */

.radio-group {
    border-bottom: 1px solid #fff;
}
.radio {
    display: block;
    border-top: 1px solid #ddd;
    padding-left: 20px;
    padding-bottom: 10px;
    padding-top: 10px;
}
.inputView {
    border: 1px solid #ddd;
    border-radius: 6px;
    margin: 10px;
    height: 25pt;
}
.button_sp {
    margin-left: 10px;
    margin-right: 10px;
    margin-top: 5px;
    background-color: #10b7ff;
    color: #fff;
}
.button_sp2 {
    margin-left: 10px;
    margin-right: 10px;
    margin-top: 5px;
    background-color: #757575;
    color: #fff;
}
</style>
